<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <link href="${pageContext.request.contextPath}/assets/css/bootstrap.min.css" rel="stylesheet" />
        <link rel="stylesheet" href="${pageContext.request.contextPath}/css/style.css"/>       
        <link href="${pageContext.request.contextPath}/assets/css/codemirror.css" rel="stylesheet"/>
        <link rel="stylesheet" href="${pageContext.request.contextPath}/assets/css/ace.min.css" />
        <link rel="stylesheet" href="${pageContext.request.contextPath}/assets/css/font-awesome.min.css" />
		<!--[if IE 7]>
		  <link rel="stylesheet" href="${pageContext.request.contextPath}/assets/css/font-awesome-ie7.min.css" />
		<![endif]-->
        <!--[if lte IE 8]>
		  <link rel="stylesheet" href="${pageContext.request.contextPath}/assets/css/ace-ie.min.css" />
		<![endif]-->
			<script src="${pageContext.request.contextPath}/assets/js/jquery.min.js"></script>

		<!-- <![endif]-->

		<!--[if IE]>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<![endif]-->

		<!--[if !IE]> -->

		<script type="text/javascript">
			window.jQuery || document.write("<script src='${pageContext.request.contextPath}/assets/js/jquery-2.0.3.min.js'>"+"<"+"/script>");
		</script>

		<!-- <![endif]-->

		<!--[if IE]>
<script type="text/javascript">
 window.jQuery || document.write("<script src='${pageContext.request.contextPath}/assets/js/jquery-1.10.2.min.js'>"+"<"+"/script>");
</script>
<![endif]-->

		<script type="text/javascript">
			if("ontouchend" in document) document.write("<script src='${pageContext.request.contextPath}/assets/js/jquery.mobile.custom.min.js'>"+"<"+"/script>");
		</script>
		<script src="${pageContext.request.contextPath}/assets/js/bootstrap.min.js"></script>
		<script src="${pageContext.request.contextPath}/assets/js/typeahead-bs2.min.js"></script>
		<!-- page specific plugin scripts -->
		<script src="${pageContext.request.contextPath}/assets/js/jquery.dataTables.min.js"></script>
		<script src="${pageContext.request.contextPath}/assets/js/jquery.dataTables.bootstrap.js"></script>
        <script type="text/javascript" src="${pageContext.request.contextPath}/js/H-ui.js"></script> 
        <script type="text/javascript" src="${pageContext.request.contextPath}/js/H-ui.admin.js"></script> 
        <script src="${pageContext.request.contextPath}/assets/layer/layer.js" type="text/javascript" ></script>
        <script src="${pageContext.request.contextPath}/assets/laydate/laydate.js" type="text/javascript"></script>
<title>公告分类</title>
	<script type="text/javascript">
		
		$(function(){
			
			 $("input[name='typeId']").click(function(){
		            $("#checkAll").prop("checked",$("input[name='typeId']").length == $("input[name='typeId']:checked").length ? true : false);
		        });
			
			$("#checkAll").click(
			  function(){
			   $("input[name='typeId']").prop("checked",this.checked);
			  }
			);
			
			//批量删除
			$("#deleteByGroup").click(function(){
				var typeId="";
				var judgement=false;
				if($("input[name='typeId']:checked").length)
					{
						layer.confirm('确认要删除吗？',function(index){
							$("input[name='typeId']:checked").each(function(){
								judgement=false;
								if(parseInt($(this).parents("tr").find(".type_size").html())!=0)
								{
								 	layer.alert("选中的分类中公告数不为零，请重新选择",{
						               title: '提示框',				
									icon:1,		
									  });
									return false;
								}
								else
								{
									judgement=true;
									typeId=typeId+$(this).parents("tr").find(".type_id").html()+";";
								}
							});
							if(judgement){
								$("#del_list").val(typeId);
								$("#delopr").val("del");
								//alert($("#del_list").val());
								//alert($("#delopr").val());
								$("#delForm").submit();
							}
							layer.close(index);	
						});
					}
				else
					{
					 layer.alert("你未选中任何项",{
			               title: '提示框',				
						icon:1,		
						  });
					}
				//alert(typeId);
			});
		});
		
		
		function checkMsg()
		{
			if($("#updatenoticeType").length>0)
			{
				  layer.alert($("#updatenoticeType").html(),{
	               title: '提示框',				
				icon:1,		
				  });
			}
		}
		
	</script>

</head>

<body onload="checkMsg();">
<div class="page-content clearfix">
    <div id="Member_Ratings">
      <div class="d_Confirm_Order_style">
     <!---->
     <div class="border clearfix">
       <span class="l_f">
        <a href="javascript:ovid()" id="member_add" class="btn btn-warning"><i class="icon-plus"></i>添加分类</a>
        <a href="javascript:ovid()" class="btn btn-danger" id="deleteByGroup"><i class="icon-trash"></i>批量删除</a>
       </span>
       <span class="r_f">共：<b>${typelist.size() }</b>条记录</span>
     </div>
     <!---->
     <div class="table_menu_list">
       <table class="table table-striped table-bordered table-hover" id="sample-table">
		<thead>
		 <tr>
				<th width="25"><label><input type="checkbox" class="ace" id="checkAll" /><span class="lbl"></span></label></th>
				<th width="80">ID</th>
				<th width="100">公告分类</th>
				<th width="100">公告数</th>
				<th width="100">状态</th>
				<th width="250">操作</th>
			</tr>
		</thead>
	<tbody>
         <c:if test="${typelist!= null && typelist.size() > 0}">
          	<c:forEach items="${typelist }" var="type">
          		<tr>
                <td width="25"><label><input type="checkbox" class="ace" name="typeId" /><span class="lbl"></span></label></td>
                <td class="type_id" width="80">${type.noticeType_id }</td>
                <td class="type_name" width="100">${type.name }</td>
                 <td class="type_size" width="100">${type.size }</td>
                 <td class="td-status" width="100"><span class="label label-success radius">未锁定</span></td>
                <td class="td-manage"  width="250">
                <a onclick="member_stop(this,'10001')"  href="javascript:;" title="锁定"  class="btn btn-xs btn-success"><i class="icon-ok bigger-120"></i></a> 
          		<a title="编辑" onclick="member_edit(this,'550')" href="javascript:;"  class="btn btn-xs btn-info" ><i class="icon-edit bigger-120"></i></a> 
          		<a title="删除" href="javascript:;"  onclick="member_del(this);" class="btn btn-xs btn-warning" ><i class="icon-trash  bigger-120"></i></a>
                </td>
          		</tr>
          	</c:forEach>
         </c:if> 
      
        <!-- noticeTypeServlet?opr=del&noticeType_id=${type.noticeType_id } -->
      </tbody>
	</table>
   </div>
  </div>
 </div>
</div>

<!--操作信息-->
<div style="display: none">
	<c:if test="${sessionScope.excuteMsg_noticeType!=null&&sessionScope.excuteMsg_noticeType.length()>0 }"><span id="updatenoticeType">${sessionScope.excuteMsg_noticeType }</span></c:if>
</div>

<!--批量删除提交-->
<div style="display: none">
	<form action="noticeTypeServlet" method="post" id="delForm">
		<input type="hidden" name="opr" id="delopr" />
		<input type="text" id="del_list" name="del_list" />
	</form>
</div>

<!--单个删除提交-->
<div style="display: none">
	<form action="noticeTypeServlet" method="post" id="delBySingle">
		<input type="hidden" name="opr" value="del" />
		<input type="hidden" name="noticeType_id" id="delsingleId" />
	</form>
</div>

<!--添加分类图层-->
<div class="add_menber" id="add_menber_style" style="display:none">
  	<form action="noticeTypeServlet" method="post" id="addForm">
  	<input type="hidden" name="opr" />
    <div class="" >
     <ul>
      <li >
      	<label class="label_name">分类名称</label>
      	<div class="col-sm-9">
      		<input name="typename" type="text" id="form-field-1" placeholder="" class="col-xs-10 col-sm-5" size="20" />
      		<input type="hidden" name="noticeType_id" id="noticeType_id" />
      	</div>
      </li>
     </ul>
  </div>
  </form>
 </div>
</body>
</html>
<script>
//加载datatable
jQuery(function($) {
var oTable1 = $('#sample-table').dataTable( {
"aaSorting": [[ 1, "desc" ]],//默认第几个排序
"bStateSave": true,//状态保存
"aoColumnDefs": [
  //{"bVisible": false, "aTargets": [ 3 ]} //控制列的隐藏显示
  {"orderable":false,"aTargets":[0,4,5]}// 制定列不参与排序
] } );
		
	$('table th input:checkbox').on('click' , function(){
		var that = this;
		$(this).closest('table').find('tr > td:first-child input:checkbox')
		.each(function(){
			this.checked = that.checked;
			$(this).closest('tr').toggleClass('selected');
		});
			
	});


	$('[data-rel="tooltip"]').tooltip({placement: tooltip_placement});
	function tooltip_placement(context, source) {
		var $source = $(source);
		var $parent = $source.closest('table')
		var off1 = $parent.offset();
		var w1 = $parent.width();

		var off2 = $source.offset();
		var w2 = $source.width();

		if( parseInt(off2.left) < parseInt(off1.left) + parseInt(w1 / 2) ) return 'right';
		return 'left';
	}
});

/*查看*/
function member_show(title,url,id,w,h){
	layer_show(title,url+'#?='+id,w,h);
}
/*锁定*/
function member_stop(obj,id){
	layer.confirm('确认要锁定吗？',function(index){
		var $aa=$($(obj).parents("td"));
		//alert($aa.html());
		$(obj).parents("tr").find(".ace").prop("checked",false).attr("disabled","disabled");
		$(obj).next().remove();
		$(obj).next().remove();
		$(obj).after('<a title="编辑" href="javascript:;"  class="btn btn-xs btn-info" ><i class="icon-edit bigger-120"></i></a> <a title="删除" href="javascript:;"  class="btn btn-xs btn-warning" ><i class="icon-trash  bigger-120"></i></a>');
		$(obj).parents("tr").find(".td-manage").prepend('<a style="text-decoration:none" class="btn btn-xs " onClick="member_start(this,id)" href="javascript:;" title="解锁"><i class="icon-ok bigger-120"></i></a>');
		$(obj).parents("tr").find(".td-status").html('<span class="label label-defaunt radius">已锁定</span>');
		$(obj).remove();
		//alert($aa.html());
		layer.msg('已锁定!',{icon: 5,time:1000});
	});
}
//<a title="编辑" onclick="member_edit('550')" href="javascript:;"  class="btn btn-xs btn-info" ><i class="icon-edit bigger-120"></i></a> 
/*解锁*/
function member_start(obj,id){
	layer.confirm('确认要启用吗？',function(index){
		$(obj).parents("tr").find(".ace").removeAttr("disabled");
		$(obj).next().remove();
		$(obj).next().remove();
		$(obj).after('<a title="编辑" onclick="member_edit(this,\'550\')" href="javascript:;"  class="btn btn-xs btn-info" ><i class="icon-edit bigger-120"></i></a> <a title="删除" href="javascript:;"  onclick="member_del(this)" class="btn btn-xs btn-warning" ><i class="icon-trash  bigger-120"></i></a>');
		$(obj).parents("tr").find(".td-manage").prepend('<a style="text-decoration:none" class="btn btn-xs btn-success" onClick="member_stop(this,id)" href="javascript:;" title="停用"><i class="icon-ok bigger-120"></i></a>');
		$(obj).parents("tr").find(".td-status").html('<span class="label label-success radius">未锁定</span>');
		var $aa=$($(obj).parents("td"));
		$(obj).remove();
		//alert($aa.html());
		layer.msg('已解锁!',{icon: 6,time:1000});
	});
}


/*分类-添加*/
$('#member_add').on('click', function(){
	 $("input[name='opr']").val("add");
   layer.open({
       type: 1,
       title: '添加分类',
		maxmin: true, 
		shadeClose: true, //点击遮罩关闭层
       area : ['800px' , ''],
       content:$('#add_menber_style'),
		btn:['提交','取消'],
		yes:function(index,layero){	
		 var num=0;
		 var str="";
    $(".add_menber input[type$='text']").each(function(n){
         if($(this).val()=="")
         {
              
			   layer.alert(str+=""+$(this).attr("name")+"不能为空！\r\n",{
               title: '提示框',				
				icon:0,								
         }); 
		    num++;
           return false;            
         } 
		 });
		  if(num>0){  return false;}	 	
         else{
       	  $("#addForm").submit();
			   layer.close(index);	
		  }		  		     				
		}
   });
});

/*分类-编辑*/
function member_edit(obj,id){
	$("input[name='opr']").val("update");
	$("#noticeType_id").val($(obj).parents("tr").find(".type_id").html());
	$("#form-field-1").val($(obj).parents("tr").find(".type_name").html());
	  layer.open({
        type: 1,
        title: '修改分类信息',
		maxmin: true, 
		shadeClose:false, //点击遮罩关闭层
        area : ['800px' , ''],
        content:$('#add_menber_style'),
		btn:['提交','取消'],
		yes:function(index,layero){	
		 var num=0;
		 var str="";
     $(".add_menber input[type$='text']").each(function(n){
          if($(this).val()=="")
          {
               
			   layer.alert(str+=""+$(this).attr("name")+"不能为空！\r\n",{
                title: '提示框',				
				icon:0,								
          }); 
		    num++;
            return false;            
          } 
		 });
		  if(num>0){  return false;}	 	
          else{
        	  $("#addForm").submit();
			   layer.close(index);	
		  }		  		     				
		}
    });
}


/*分类-删除*/
function member_del(obj){
	layer.confirm('确认要删除吗？',function(index){
		if(parseInt($(obj).parents("tr").find(".type_size").html())!=0)
		{
			 layer.alert("该分类下公告数不为空，无法删除",{
	               title: '提示框',				
					icon:0,								
	         }); 
		}
		else
		{
			$("#delsingleId").val($(obj).parents("tr").find(".type_id").html());
			$("#delBySingle").submit();
		}
		layer.close(index);	
	});
}
laydate({
    elem: '#start',
    event: 'focus' 
});

</script>